<template>
    <div class="app-container">
        <div class="table-wrapper">
            <h4>道路易损性计算</h4>
            <el-form :inline="true" ref="queryRef" :rules="rules" label-position="right" :model="params"
                label-width="200px">
                <el-row justify="center">
                    <el-col :span="11">
                        <el-form-item label="编号：" class="form-item" prop="code">
                            <el-input v-model="params.code" placeholder="" :disabled="true" clearable />
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="年代：" class="form-item" prop="year">
                            <el-input v-model="params.year" placeholder="请输入" :disabled="disabled" clearable />
                            <!-- <el-select v-model="params.year" placeholder="请选择" class="form-select" :disabled="disabled"
                                clearable>
                                <el-option v-for="item in yearsOptions" :key="item.value" :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select> -->
                        </el-form-item>
                    </el-col>
                    <!-- <el-col :span="11">
                        <el-form-item label="维护人：" class="form-item" prop="userName">
                            <el-input v-model="params.userName" placeholder="" clearable />
                        </el-form-item>
                    </el-col> -->
                </el-row>
                <!-- <el-row justify="center">
                    <el-col :span="11">
                        <el-form-item label="维护人所属单位：" class="form-item" prop="orgName">
                            <el-input v-model="params.orgName" placeholder="" clearable />
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="维护时间：" class="form-item" prop="createTime">
                            <el-date-picker v-model="params.createTime" type="date" value-format="YYYY-MM-DD"
                                placeholder="选择日期">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row> -->
                <el-row justify="center">
                    <el-col :span="11">
                        <el-form-item label="设防情况：" class="form-item" prop="fortification">
                            <el-select v-model="params.fortification" placeholder="请选择" class="form-select"
                                :disabled="disabled" clearable>
                                <el-option v-for="item in optionList1" :label="item.dictItemName"
                                    :value="item.dictItemCode">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11"></el-col>
                </el-row>
                <el-row v-if="isAdd" justify="end">
                    <el-form-item class="bottom-button">
                        <!-- <el-button type="primary" @click="showUploadDialog = true">参数导入</el-button> -->
                        <el-button type="primary" @click="handleVerify" v-if="!route.query.id">验证</el-button>
                        <el-button type="primary" @click="onCalc()" v-if="route.query.id">计算</el-button>
                        <el-button type="primary" @click="onSubmit()" v-if="route.query.id">提交</el-button>
                    </el-form-item>
                </el-row>
            </el-form>
            <!-- 数据导入弹框 -->
            <import-data v-if="showUploadDialog" v-model="showUploadDialog" ref="uploadDialog" :uploadUrl="uploadUrl"
                downloadFileName="道路易损性计算参数导入.xlsx" @importSuccess="onImport"></import-data>

            <el-form :inline="true" ref="tableRef" :rules="rules" label-position="right" :model="tableData">
                <el-table class="listTable" ref="multipleTableRef" border :data="tableData" style="width: 100%"
                    @selection-change="onSelectionChange" :cell-style="{ border: '1px solid #e5ebf7', }"
                    :header-cell-style="{ border: '1px solid #e5ebf7', borderLeft: 'none' }">
                    <el-table-column type="selection" width="55" label="序号" />
                    <el-table-column prop="intensity" header-align="center" align="center" label="基本烈度">
                        <template #default="scope">
                            <el-form-item :prop="`${scope.$index}.intensity`" :rules="rules.intensity">
                                <el-select v-model="scope.row.intensity" :disabled="scope.row.disabled" size="small"
                                    placeholder="请选择" class="form-select">
                                    <el-option v-for="item in optionList2" :key="item.dictItemCode"
                                        :label="item.dictItemName" :value="item.dictItemCode">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </template>
                    </el-table-column>
                    <el-table-column prop="roadbedSoil" header-align="center" align="center" label="路基土">
                        <template #default="scope">
                            <el-form-item :prop="`${scope.$index}.roadbedSoil`" :rules="rules.roadbedSoil">
                                <el-select v-model="scope.row.roadbedSoil" :disabled="scope.row.disabled" size="small"
                                    placeholder="请选择" class="form-select">
                                    <el-option v-for="item in optionList3" :key="item.dictItemCode"
                                        :label="item.dictItemName" :value="item.dictItemCode">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </template>
                    </el-table-column>
                    <el-table-column prop="siteSoil" header-align="center" align="center" label="场地类别">
                        <template #default="scope">
                            <el-form-item :prop="`${scope.$index}.siteSoil`" :rules="rules.siteSoil">
                                <el-select v-model="scope.row.siteSoil" :disabled="scope.row.disabled" size="small"
                                    placeholder="请选择" class="form-select">
                                    <el-option v-for="item in optionList4" :key="item.dictItemCode"
                                        :label="item.dictItemName" :value="item.dictItemCode">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </template>
                    </el-table-column>
                    <el-table-column prop="foundationFail" header-align="center" align="center" label="地基失效程度">
                        <template #default="scope">
                            <el-form-item :prop="`${scope.$index}.foundationFail`" :rules="rules.foundationFail">
                                <el-select v-model="scope.row.foundationFail" :disabled="scope.row.disabled" size="small"
                                    placeholder="请选择" class="form-select">
                                    <el-option v-for="item in optionList5" :key="item.dictItemCode"
                                        :label="item.dictItemName" :value="item.dictItemCode">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </template>
                    </el-table-column>
                    <el-table-column prop="roadbedType" header-align="center" align="center" label="路基类型">
                        <template #default="scope">
                            <el-form-item :prop="`${scope.$index}.roadbedType`" :rules="rules.roadbedType">
                                <el-select v-model="scope.row.roadbedType" :disabled="scope.row.disabled" size="small"
                                    placeholder="请选择" class="form-select">
                                    <el-option v-for="item in optionList6" :key="item.dictItemCode"
                                        :label="item.dictItemName" :value="item.dictItemCode">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </template>
                    </el-table-column>
                    <el-table-column prop="roadbedHigh" header-align="center" align="center" label="路基高程H(m)">
                        <template #default="scope">
                            <el-form-item :prop="`${scope.$index}.roadbedHigh`" :rules="rules.roadbedHigh">
                                <el-select v-model="scope.row.roadbedHigh" :disabled="scope.row.disabled" size="small"
                                    placeholder="请选择" class="form-select">
                                    <el-option v-for="item in optionList7" :key="item.dictItemCode"
                                        :label="item.dictItemName" :value="item.dictItemCode">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </template>
                    </el-table-column>
                    <el-table-column prop="destructiveState" header-align="center" align="center" label="震害等级结果" />
                    <el-table-column header-align="center" align="center" label="修正值">
                        <template #default="scope">
                            <el-form-item :prop="`${scope.$index}.destructiveStateCorrect`">
                                <el-input v-model="scope.row.destructiveStateCorrect" :disabled="scope.row.disabled"
                                    size="small"></el-input>
                            </el-form-item>
                        </template>
                    </el-table-column>
                    <!-- <el-table-column v-if="isAdd" label="操作" fixed="right">
                        <template #default="scope">
                            <el-button @click="handleBrickModify(scope.$index, scope.row)" type="text"
                                size="small">应用</el-button>
                            <el-button @click.prevent="handleCalcdelete(scope.$index, tableData)" type="text"
                                size="small">删除</el-button>
                        </template>
                    </el-table-column> -->
                </el-table>
                <!-- <el-button v-if="isAdd" class="add" style="width: 100%" plain @click="handleCalcAdd()">
                    <el-icon style="vertical-align: middle">
                        <Plus />
                    </el-icon>
                </el-button> -->
                <el-row justify="end">
                    <el-button type="primary" @click="viewProject()" style="margin:20px 0;"
                        v-if="route.query.id && route.query.operateType">查看详细计算过程</el-button>
                </el-row>
            </el-form>
            <!-- 版本查看 -->
            <GetVersion v-if="openDialog" v-model:open="openDialog" @recalculateVersion="recalculateVersion" type="5" />
            <el-dialog v-model="dialogVisible" @close="cancle" title="提示" width="500px">
                <p v-for="item in messageList">{{ item.label }}
                    <el-popover placement="bottom" title="提示详情" :width="200" trigger="click">
                        <template #reference>
                            <span style="color: #107ce5;cursor: pointer;">提示详情</span>
                        </template>
                        <template #default>
                            <p v-for="val in item.value">{{ val }}</p>
                        </template>
                    </el-popover>
                </p>
                <p>&nbsp;</p>
            </el-dialog>
        </div>
    </div>
</template>

<script setup>
import { reactive, toRefs } from "vue";
import { ElMessage, ElMessageBox } from 'element-plus'
// 接口
import { getInfo } from '@/api/login'
import {
    getProvince,//省份
    getChildArea,//子区域
} from "@/api/system/division";
import {
    getByIdAndType,//查询
    crVulnerability,//计算
    saveVulnerability2,//保存
    importVulnerabilityUrl,//参数导入
    recalculateCar,//验证
    saveCarResult,//计算保存
} from "@/api/lifelineVulnerAnalysis/lifelineVulnerAnalysis.js";
import { getValidDictItemsByDictCode } from "@/api/map/disasterDataManagement/lifelineSystemInfo.js";
// 公用方法
import { parseTime } from "@/utils/ruoyi.js";
// 引入公式组件
import GetVersion from '../underPipeNet/dataFile/Version.vue';
// 引入导入弹框
import ImportData from "@/components/ImportData";

// 引入store
import useUserStore from '@/store/modules/user';
import useDictStore from '@/store/modules/dict';
// 获取pinia
const userStore = useUserStore();
const dictStore = useDictStore();
// 用户名
const userName = computed(() => userStore.name || '');
// 所属机构名称
const orgName = computed(() => userStore.orgName || '');

// 当前实例
const { proxy } = getCurrentInstance();
// 当前路由
const route = useRoute();
const router = useRouter();

// 打开类型，query为查看
let operateType = computed(() => route.query.operateType || false);
// 是否是新增页，有路由参数是详情页，否则是新增页
let isAdd = computed(() => (route.query.id && route.query.operateType ? false : true));
// 禁用
const disabled = ref(false);

//最多保留N小数 ,N 在 options {decimals: N} 中定义
const positivedecimals = (rule, value, callback) => {
    value = String(value);
    if (
        value.indexOf(".") != -1 &&
        (value.split(".").length > rule.options.decimals ||
            value.split(".")[0] === "" ||
            value.split(".")[1] === "")
    ) {
        callback(new Error()); //防止输入多个小数点
    } else if (
        value.indexOf(".") != -1 &&
        value.split(".")[1].length > rule.options.decimals
    ) {
        callback(new Error()); //小数点后两位
    } else {
        callback();
    }
};
//验证是否yyyy年份（非必填）
const isYearNotMust = (rule, value, callback) => {
    if (value == '' || value == undefined || value == null) {
        callback();
    } else if (isNaN(Number(value))) {
        callback(new Error('请输入yyyy格式如2022'));
    } else if (value.toString().length != 4) {
        callback(new Error('请输入yyyy格式如2022'));
    } else if (value.toString().indexOf(".") != -1) {
        callback(new Error('请输入yyyy格式如2022'));
    } else {
        callback();
    }
}
const data = reactive({
    // 表单参数
    params: {
        code: "",//编号
        year: "",//年代
        fortification: "", //设防情况
        province: "",//省
        city: "",//市
        county: "",//区、县
        createTime: parseTime(new Date()), //维护时间
        userName: userName.value, //维护人
        orgName: orgName.value, //维护人所属单位
    },
    // 设防情况
    fortificationOptions: dictStore.fortificationOptions1 || [],
    // 年份
    yearsOptions: dictStore.yearsOptions1 || [],
    // 基本烈度，候选值：请选择、Ⅵ、Ⅶ、Ⅷ、Ⅸ、
    basicIntensityOptions: dictStore.basicIntensityOptions || [],
    // 路基土，候选值：请选择 坚硬土 粘土 粉土、细砂土 分期施工路基
    roadbedSoilOptions: [
        {
            value: '坚硬土',
            label: '坚硬土'
        }, {
            value: '粘土',
            label: '粘土'
        }, {
            value: '粉土',
            label: '粉土'
        }, {
            value: '细砂土',
            label: '细砂土'
        }, {
            value: '分期施工路基',
            label: '分期施工路基'
        }
    ],
    // 场地类别，候选值：请选择、I类、II类、Ⅲ类、IV类
    siteOptions: [
        {
            value: 'I类',
            label: 'I类'
        }, {
            value: 'II类',
            label: 'II类'
        }, {
            value: 'III类',
            label: 'III类'
        }, {
            value: 'IV类',
            label: 'IV类'
        }
    ],
    // 地基失效程度，候选值：请选择、无、轻、中、重
    foundationFailOptions: [
        {
            value: '无',
            label: '无'
        }, {
            value: '轻',
            label: '轻'
        }, {
            value: '中',
            label: '中'
        }, {
            value: '重',
            label: '重'
        }
    ],
    // 路基类型，候选值：请选择、低矮路基、路堤路堑、挖填结合、沿河路基
    roadbedTypeOptions: [
        {
            value: '低矮路基',
            label: '低矮路基'
        }, {
            value: '路堤路堑',
            label: '路堤路堑'
        }, {
            value: '挖填结合',
            label: '挖填结合'
        }, {
            value: '沿河路基',
            label: '沿河路基'
        }
    ],
    // 路基高程，候选值：请选择、H≤1、1<H≤2、2<H≤3、3<H
    roadbedElevationOptions: [
        {
            value: 'H≤1',
            label: 'H≤1'
        }, {
            value: '1<H≤2',
            label: '1<H≤2'
        }, {
            value: '2<H≤3',
            label: '2<H≤3'
        }, {
            value: '3<H',
            label: '3<H'
        }
    ],
    // 表单验证规则
    rules: {
        // 基础表单
        fortification: [{ required: true, message: '请选择', trigger: 'change' }],
        year: [{ required: true, message: '请选择', validator: isYearNotMust, trigger: ["change", "blur"], }],
        // 表格表单
        intensity: [{ required: true, message: '请选择', trigger: 'change' }],
        roadbedSoil: [{ required: true, message: '请选择', trigger: 'change' }],
        siteSoil: [{ required: true, message: '请选择', trigger: 'change' }],
        foundationFail: [{ required: true, message: '请选择', trigger: 'change' }],
        roadbedType: [{ required: true, message: '请选择', trigger: 'change' }],
        roadbedHigh: [{ required: true, message: '请选择', trigger: 'change' }],
    },
    //表格
    tableData: [],
    multipleSelection: [],
});
const {
    params,
    fortificationOptions,
    yearsOptions,
    basicIntensityOptions,
    roadbedSoilOptions,
    siteOptions,
    foundationFailOptions,
    roadbedTypeOptions,
    roadbedElevationOptions,
    rules,
    tableData,
    multipleSelection,
} = toRefs(data);

//行政区划
const provinceData = ref([]); //省
const cityData = ref([]); //市
const areaData = ref([]); //区、县
/** 获取省列表 */
function getProvinceData() {
    getProvince().then((response) => {
        provinceData.value = response.data;
    });
}
// 选择省份
function chooseProvince(value) {
    params.value.city = null;
    params.value.county = null;
    params.value.province = value.name;
    cityData.value = [];
    areaData.value = [];
    getChildArea(value.id).then(response => {
        cityData.value = response.data;
    });
}
// 选择城市
function chooseCity(value) {
    params.value.city = value.name;
    params.value.county = null;
    areaData.value = [];
    getChildArea(value.id).then((response) => {
        areaData.value = response.data;
    });
}
// 选择区县
function chooseCounty(value) {
    params.value.county = value.name;
}

// 获取用户
function getUserInfo(userId) {
    getInfo(userId).then(response => {
        const { code, user } = response;
        if (user) {
            params.value.userName = user.userName;
            params.value.maintainerUnit = user.orgName;
        }
    });
};

// 表格
const multipleTableRef = ref();
// 表格选中行
const onSelectionChange = (val) => {
    multipleSelection.value = val;
}
// 表格新增行
const handleCalcAdd = () => {
    tableData.value.push({
        intensity: "",
        roadbedSoil: "",
        siteSoil: "",
        foundationFail: "",
        roadbedType: "",
        roadbedHigh: "",
        seismicDamageGrade: "",
        destructiveStateCorrect: "",
    });
};
// 删除行
const handleCalcdelete = (index, rows) => {
    rows.splice(index, 1);
}
// 应用
const handleBrickModify = (index, row) => {
    onCalc(index);
}

// 点击编号跳转至此数据的详细信息界面
const viewProject = () => {
    if (multipleSelection.value) {
        if (multipleSelection.value.length == 1) {
            // 设置缓存
            localStorage.setItem("formData", JSON.stringify(params.value));
            localStorage.setItem("gridData", JSON.stringify(tableData.value));
            // 跳转处理
            const curRow = multipleSelection.value[0];
            router.push({
                path: '/lifelineVulnerAnalysis/singleDataCalcProcess',
                query: {
                    ...params.value,
                    ...curRow
                }
            })
        } else if (multipleSelection.value.length > 1) {
            proxy.$modal.msgWarning("请只选择一行数据!");
        } else if (multipleSelection.value.length == 0) {
            proxy.$modal.msgWarning("请选择一行数据!");
        }
    }
}

// 导入弹框是否显示
let showUploadDialog = ref(false);
// 导入数据接口路径
const uploadUrl = ref(importVulnerabilityUrl);
// 导入成功回调
const onImport = (response, uploadFile, uploadFiles) => {
    const { code, data } = response;
    if (code == 200 && data) {
        proxy.$modal.msgSuccess('导入数据成功!');
        // 列表数据回显
        tableData.value = [...data];
    }
}
// 道路易损性计算
const onCalc = async () => {
    const queryValid = await proxy.$refs['queryRef'].validate((valid, fields) => { valid, fields });
    const tableValid = await proxy.$refs['tableRef'].validate((valid, fields) => { valid, fields });
    // 表单验证
    if (queryValid && tableValid) {
        let formData = tableData.value[0];
        let query = {
            id: formData.id,
            intensity: formData.intensity,
            roadbedSoil: formData.roadbedSoil,
            siteSoil: formData.siteSoil,
            roadbedType: formData.roadbedType,
            roadbedHigh: formData.roadbedHigh,
            foundationFail:formData.foundationFail,
            fortification:params.value.fortification,
            destructiveStateCorrect: formData.destructiveStateCorrect,
            ubInd: formData.ubInd,
            oi: formData.oi,
            p02: formData.p02,
            p24: formData.p24,
            p46: formData.p46,
            p68: formData.p68,
            p810: formData.p810,
            basicIntact: formData.basicIntact,
            slightDamage: formData.slightDamage,
            moderateDamage: formData.moderateDamage,
            badlyDamaged: formData.badlyDamaged,
            destroy: formData.destroy,
            destructiveState: formData.destructiveState,
            rdIds: formData.rdIds,
            ddIds: formData.ddIds,
        }
        proxy.$modal.loading('正在努力计算,请耐心等待！');
        crVulnerability(query).then((res) => {
            proxy.$modal.closeLoading();
            const { code, data } = res;
            if (code === 200 && data) {
                proxy.$modal.msgSuccess('计算完成！计算结果未保存，若需保存结果，请计算后点击提交按钮！');
                tableData.value = [{ ...tableData.value[0], ...data }];
                // tableData.value = data;
            } else {
                proxy.$modal.msgError("计算失败！");
            }
        }).catch(err => {
            proxy.$modal.closeLoading();
            console.log(err.message);
        });
    }
};
// 道路易损性保存
const onSubmit = () => {
    proxy.$refs['queryRef'].validate(async (valid, fields) => {
        if (valid) {
            const tableValid = await proxy.$refs['tableRef'].validate((valid, fields) => { valid, fields });
            let formData = tableData.value[0];
            // 表格表单验证
            if (tableValid) {
                let query = {
                    type: '5',
                    roadParam: {
                        id: formData.id,
                        intensity: formData.intensity,
                        roadbedSoil: formData.roadbedSoil,
                        siteSoil: formData.siteSoil,
                        roadbedType: formData.roadbedType,
                        roadbedHigh: formData.roadbedHigh,
                        fortification:params.value.fortification,
                        foundationFail:formData.foundationFail,
                        destructiveStateCorrect: formData.destructiveStateCorrect,
                        ubInd: formData.ubInd,
                        oi: formData.oi,
                        p02: formData.p02,
                        p24: formData.p24,
                        p46: formData.p46,
                        p68: formData.p68,
                        p810: formData.p810,
                        basicIntact: formData.basicIntact,
                        slightDamage: formData.slightDamage,
                        moderateDamage: formData.moderateDamage,
                        badlyDamaged: formData.badlyDamaged,
                        destroy: formData.destroy,
                        destructiveState: formData.destructiveState,
                        rdIds: formData.rdIds,
                        ddIds: formData.ddIds,
                    }
                }
                proxy.$modal.loading('正在保存,请耐心等待！');
                saveVulnerability2(query).then((res) => {
                    proxy.$modal.closeLoading();
                    const { code, data } = res;
                    if (code === 200) {
                        proxy.$modal.msgSuccess("保存成功！");
                        // 延迟跳转
                        setTimeout(() => {
                            router.push('/lifelineVulnerAnalysis/lifelineMain')
                        }, 1500)
                    } else {
                        proxy.$modal.msgWarning("保存失败!");
                    }
                }).catch(err => {
                    proxy.$modal.closeLoading();
                    console.log(err.message);
                });
            }
        } else {
            proxy.$refs['queryRef'].scrollToField(Object.keys(fields)[0])
        }
    })
}

// 显示弹框
const openDialog = ref(false)
const handleVerify = () => {
    openDialog.value = true;
}
// 验证
const messageList = ref([]);
const dialogVisible = ref(false);
const cancle = () => {
    dialogVisible.value = false;
}
const recalculateVersion = (version) => {
    openDialog.value = false;
    recalculateCar({ versionId:version.id, type: '5' }).then(res => {
        if (JSON.stringify(res.data) == '{}') {
            ElMessageBox.confirm(
                '数据通过验证，是否计算？', '提示',
                {
                    confirmButtonText: '计算并保存',
                    cancelButtonText: '取消',
                    type: 'success',
                }
            )
                .then(() => {
                    saveCarResult({ versionId:version.id }).then(response => {
                        if (response.code == 200) {
                            router.push(`/lifelineVulnerAnalysis/lifelineMain?type=5`)
                        }
                    })
                }).catch(() => { })
        } else {
            const { data } = res;
            messageList.value = [];
            for (let i in data) {
                messageList.value.push({ label: `第${i}行计算参数未填写完整，请补充完整再计算。`, value: data[i] })
            }
            dialogVisible.value = true;
        }
    })
}
// 获取数据
function getData(query) {
    getByIdAndType(query).then((res) => {
        const { code, data } = res;
        if (code === 200 && data) {
            const { roadVo, tableEntity } = data;
            if (roadVo) {
                // 基础信息
                params.value.code = tableEntity.code;
                params.value.fortification = tableEntity.fortification;
                params.value.year = tableEntity.year;
                // 维护时间
                const dateTime = new Date()
                params.value.createTime = parseTime(dateTime);
                // 根据id获取用户信息
                params.value.userName = userStore.name;
                params.value.orgName = userStore.orgName;
                // getUserInfo(tableEntity.createUser);
                //循环遍历之前加上非空判断
                tableData.value = [{ ...roadVo, disabled: operateType.value === 'query' ? true : false }]
            }
        }
    }).catch(err => {
        console.log(err.message);
    });
}

// 移除缓存
function removeStorage() {
    localStorage.removeItem("formData");
    localStorage.removeItem("gridData");
}

// 字典表查询
const optionList1 = ref([])
const optionList2 = ref([])
const optionList3 = ref([])
const optionList4 = ref([])
const optionList5 = ref([])
const optionList6 = ref([])
const optionList7 = ref([])
/** 获取字典值 */
async function getDictData() {
    await getValidDictItemsByDictCode("smxdlsfqk").then(response => {
        optionList1.value = response.data;//设防情况
    });
    await getValidDictItemsByDictCode("smxsfld").then(response => {
        optionList2.value = response.data;//基本烈度
    });
    await getValidDictItemsByDictCode("smxdlljt").then(response => {
        optionList3.value = response.data;//路基土
    });
    await getValidDictItemsByDictCode("smxcdlb").then(response => {
        optionList4.value = response.data;//场地类别
    });
    await getValidDictItemsByDictCode("smxdldjsx").then(response => {
        optionList5.value = response.data;//地基失效
    });
    await getValidDictItemsByDictCode("smxdlljlx").then(response => {
        optionList6.value = response.data;//路基类型
    });
    await getValidDictItemsByDictCode("smxdllmgc").then(response => {
        optionList7.value = response.data;//路基高程
    });
}
getDictData();
// 挂载
onMounted(() => {
    // 获取省份数据
    getProvinceData();
    const id = route.query.id;
    const type = route.query.type;
    // 若为返回按钮跳转，则从缓存读取数据
    if (type == 'back') {
        // 获取缓存
        const paramData = JSON.parse(localStorage.getItem("formData"));
        const gridData = JSON.parse(localStorage.getItem("gridData"));
        if (paramData) {
            params.value = { ...paramData };
        }
        if (gridData && gridData.length) {
            tableData.value = [...gridData];
        }
    }
    else if (id && type) {
        disabled.value = true;
        // 获取数据
        getData({ type: 5, id });
        // 移除缓存
        removeStorage();
    } else {
        disabled.value = false
        // 移除缓存
        removeStorage();
    }
});
</script>

<style lang="scss" scoped>
.table-wrapper {
    position: relative;

    h4 {
        font-size: 16px;
        font-weight: bold;
        color: #107ce5;
        text-align: center;
    }
}
</style>


